<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>CMS</title>
    <link href="__CSS__/common.css" rel="stylesheet"/>
    <link href="__CSS__/right.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="__CSS__/extjs/css/ext-all.css"/>
    <script type="text/javascript" language="javascript" src="__JS__/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="__JS__/extjs/ext-base.js"></script>
    <script type="text/javascript" src="__JS__/extjs/ext-all.js"></script>
    <script type="text/javascript" src="__JS__/extjs/ext-lang-zh_CN.js"></script>
    <script charset="utf-8" src="__JS__/common.js"></script>
    <style type="text/css">
        .x-grid3-col {
            padding: 5px;
        }
        .x-grid-back-red {
            background: #EEEEEE;
        }
    </style>
</head>
<body>
<!--右侧区域 begin-->
<div class="right">
    <!--当前位置 begin-->
    <include file='common:crumbs'/>
    <!--当前位置 end-->
    <!--主体区域 begin-->
    <div class="container">
        <div class="alert_div">
            <h4 class="alert_info"><span class="welcome">{$welcome}</span>您现在的位置是：{$current} </h4>
            <h4 class="alert_what" style="display:none;"></h4>
        </div>
        <!--样式一 begin-->
        <div class="stats">
            <div class="lm_title">
                <div class="lm_title_l"><em>健康及产品管理</em></div>
            </div>
            <div class="lm_content">
                <div id="product_grid"></div>
            </div>
            <div class="lm_bottom">
                <div class="lm_bottom_l"><em></em></div>
            </div>
        </div>
        <!--样式一 end-->
    </div>
    <!--主体区域 end-->
</div>
<!--右侧区域  end-->
</body>
<script type="text/javascript">
var adminName = "张飞";
var pageNum = 10;
Ext.util.CSS.swapStyleSheet("theme", "__CSS__/extjs/css/xtheme-gray.css");
Ext.QuickTips.init();
/* Ext.apply(Ext.form.VTypes, {
 IPAddress:  function(v) {
 return /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(v);
 },

 IPAddressText: '必须是一个IP地址',
 IPAddressMask: /[\d\.]/i
 }); */

Ext.form.VTypes = function () {
    var alpha = /^[a-zA-Z_]+$/;
    var alphanum = /^[a-zA-Z0-9_]+$/;
    var number = /^[0-9]+$/;
    var email = /^(\w+)([-+.][\w]+)*@(\w[-\w]*\.){1,5}([A-Za-z]){2,4}$/;
    var url = /(((https?)|(ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;
    return {
        'email': function (v) {
            return email.test(v);
        },
        'emailText': '必须是正确的email地址，例如： "user@jiuletech.com"',
        'emailMask': /[a-z0-9_\.\-@]/i,
        'url': function (v) {
            return url.test(v);
        },
        'urlText': '必须是一个正确的URL地址，例如： "http:/' + '/www.jiuletech.com"',
        'alpha': function (v) {
            return alpha.test(v);
        },
        'alphaText': '只能包含字母和下划线',
        'alphaMask': /[a-z_]/i,
        'alphanum': function (v) {
            return alphanum.test(v);
        },
        'alphanumText': '只能包含字母、数字、下划线',
        'alphanumMask': /[a-z0-9_]/i,
        'number': function (v) {
            return number.test(v);
        },
        'numberText': '只能是数字',
        'numberMask': /[0-9]/i
    };
}();

Ext.onReady(function () {
    var Record = Ext.data.Record.create([
        {name: 'id', type: 'int'},
        {name: 'spo2', type: 'int'},
        {name: 'heartrate', type: 'int'},
        {name: 'breath', type: 'int'},
        {name: 'skin', type: 'int'},
        {name: 'healthindex', type: 'int'},
        {name: 'activity', type: 'int'},
        {name: 'type', type: 'int'},
        {name: 'time', type: 'int'}
    ]);

    // create the Data Store
    var store = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({url: '__GROUP__/extajax/getProductDataJson'}),
        reader: new Ext.data.JsonReader({totalProperty: "results", root: "rows", idProperty: "id"}, Record),
        pruneModifiedRecords: true, //每次操作清除modified
        remoteSort: true
    });
    //store.load();

    var sm = new Ext.grid.CheckboxSelectionModel();
    var cm = new Ext.grid.ColumnModel([
        {header: '序号', dataIndex: 'id', sortable: true, remoteSort: true, width: 45, hidden: true},
        {header: 'spo2', dataIndex: 'spo2', sortable: true, remoteSort: true},
        {header: '心率', dataIndex: 'heartrate', width: 80, sortable: true, remoteSort: true},
        {header: '呼吸', dataIndex: 'breath', width: 80, sortable: true, remoteSort: true},
        {header: '皮肤导电性', dataIndex: 'skin', width: 80, sortable: true, remoteSort: true},
        {header: '健康指数', dataIndex: 'healthindex', width: 80, sortable: true, remoteSort: true},
        {header: '活动量', dataIndex: 'activity', width: 80, sortable: true, remoteSort: true},
        {header: '类型', dataIndex: 'type', sortable: true, remoteSort: true, renderer: function (value) {
            //正常、紧急呼叫、预警、报警、跌倒和后台请求
            switch (value) {
                case 1 :
                    return "正常";
                case 2 :
                    return "紧急呼叫";
                case 3 :
                    return "预警";
                case 4 :
                    return "报警";
                case 5 :
                    return "跌倒";
                default :
                    return "后台请求";
            }
        }, width: 60},
        {header: '数据时间', dataIndex: 'time', sortable: true, remoteSort: true, renderer: function (value) {
            if (value == null || value == 0) {
                return '';
            } else {
                return Ext.util.Format.date(new Date(value), "Y-m-d h:i:s");
            }
        }, editor: new Ext.grid.GridEditor(new Ext.form.DateField({
            format: "Y年m月d日",
            allowBlank: false
        })), width: 90}
    ]);

    //控件
    var mybar = new Ext.Toolbar([ '-', {
        xtype: "button",
        text: "导出",
        menu: {
            items: [
                {
                    text: '导出所有页面',
                    handler: function () {
                        $.post("__GROUP__/extajax/getProductDataJson", {exportxls: 1}, function (data) {
                            if (data != '') {
                                if (data['code'] == 1) {
                                    location.href = data['download'];
                                    //alert(data['download']);
                                } else {

                                    jl_notify(2, "导出execl数据失败！");
                                }
                            }
                        }, 'json')
                    }
                },
                {
                    text: '导出当前页面',
                    handler: function () {
                        var lastParams = store.lastOptions.params;
                        lastParams['exportxls'] = 1;
                        $.post("__GROUP__/extajax/getProductDataJson", lastParams, function (data) {
                            if (data != '') {
                                if (data['code'] == 1) {
                                    location.href = data['download'];
                                    //alert(data['download']);
                                } else {

                                    jl_notify(2, "导出execl数据失败！");
                                }
                            }
                        }, 'json')
                    }
                }
            ]
        }
    }, '-', {xtype: "tbtext", text: '会员 ID 编号：'},
        new Ext.form.TextField({
            id: "filter_userid",
            vtype: 'alphanum'
        }), '-', new Ext.form.ComboBox({
            id: 'filter_type',
            name: 'filter_type',
            displayField: 'text',
            valueField: 'value',
            emptyText: '状态筛选',
            editable: false,
            mode: 'local',
            triggerAction: 'all',
            width: 100,
            store: new Ext.data.SimpleStore({
                //正常、紧急呼叫、预警、报警、跌倒和后台请求
                fields: ['value', 'text'],
                data: [
                    [1, '正常'],
                    [2, '紧急呼叫'],
                    [3, '预警'],
                    [4, '报警'],
                    [5, '跌倒'],
                    ['', '不限']
                ]
            })
        }), '-', new Ext.form.DateField({
            id: 'filter_date',
            format: "Y-m-d",
            allowBlank: false,
            maxValue: '{$maxDay}',
            minValue: '{$minDay}',
            editable: false,
            value: '{$maxDay}'
        }), {
            text: '应用筛选',
            handler: function () {
                var filter_date = Ext.getCmp("filter_date").getValue();
                var filter_userid = Ext.getCmp("filter_userid").getValue();
                var filter_type = Ext.getCmp("filter_type").getValue();
                Ext.apply(Ext.getCmp("product_id").store.baseParams, { "filter_like_userid": filter_userid, "filter_req_type": filter_type, "filter_ext_date": filter_date});
                Ext.getCmp("product_id").store.removeAll();
                Ext.getCmp("product_id").store.load({params: {start: 0, limit: pageNum}});
            }
        }
    ]);

    var grid = new Ext.grid.GridPanel({
        id: "product_id",
        height: 500,
        autoHeight: true,
        bodyStyle: 'width:100%',
        autoWidth: true,
        title: '',
        store: store,
        trackMouseOver: true,
        loadMask: true,
        stripeRows: true,
        cm: cm,
        sm: sm,
        clicksToEdit: 1,
        viewConfig: {
            forceFit: true,
            enableRowBody: true,
            showPreview: true
        },
        bbar: [new Ext.PagingToolbar({
            id: "page_toolbar",
            pageSize: pageNum,
            store: store,
            displayInfo: true,
            displayMsg: '总共 {2}条数据，当前显示 {0} - {1} 条数据',
            emptyMsg: "没有数据"
        }), {xtype: "tbfill"}, {
            xtype: "button",
            text: '分页大小',
            menu: {
                items: [
                    {
                        text: '10条',
                        handler: function () {
                            pageNum = 10;
                            Ext.getCmp("page_toolbar").pageSize = pageNum;
                            Ext.getCmp("page_num_text").setValue(pageNum);
                            store.removeAll();
                            store.load({params: {start: 0, limit: pageNum}});
                        }
                    },
                    {
                        text: '20条',
                        handler: function () {
                            pageNum = 20;
                            Ext.getCmp("page_toolbar").pageSize = pageNum;
                            Ext.getCmp("page_num_text").setValue(pageNum);
                            store.removeAll();
                            store.load({params: {start: 0, limit: pageNum}});
                        }
                    },
                    {
                        text: '30条',
                        handler: function () {
                            pageNum = 30;
                            Ext.getCmp("page_toolbar").pageSize = pageNum;
                            Ext.getCmp("page_num_text").setValue(pageNum);
                            store.removeAll();
                            store.load({params: {start: 0, limit: pageNum}});
                        }},
                    {
                        text: '50条',
                        handler: function () {
                            pageNum = 50;
                            Ext.getCmp("page_toolbar").pageSize = pageNum;
                            Ext.getCmp("page_num_text").setValue(pageNum);
                            store.removeAll();
                            store.load({params: {start: 0, limit: pageNum}});
                        }},
                    {
                        text: '100条',
                        handler: function () {
                            pageNum = 100;
                            Ext.getCmp("page_toolbar").pageSize = pageNum;
                            Ext.getCmp("page_num_text").setValue(pageNum);
                            store.removeAll();
                            store.load({params: {start: 0, limit: pageNum}});
                        }
                    }
                ]
            }
        }, new Ext.form.TextField({
            id: "page_num_text",
            value: "10",
            width: 30,
            //disabled:true,
            readOnly: true,
            vtype: 'alphanum'
        }), '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'],
        tbar: mybar
    });

    // 渲染
    grid.render('product_grid');

    window.onresize = function () {
        grid.setWidth(0);
        grid.setWidth(Ext.get("product_grid").getWidth());
    };
    // 取得数据
    store.load({params: {start: 0, limit: pageNum}});
});
</script>
</html>